.default{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: white;
    z-index: 99999;
    .loading-box{
        width: 100px;
        height: 100px;
        text-align: center;
        line-height: 100px;
        position: relative;
        .load{
            animation: loading 1s infinite linear;
            -moz-animation: loading 1s infinite linear; /* Firefox */
            -webkit-animation: loading 1s infinite linear; /* Safari and Chrome */
            -o-animation: loading 1s infinite linear; /* Opera */
            width: 100%;
            height: 100%;
            i{
                width: 100%;
                height: 100%;
                color: rgb(0, 162, 255);
                font-size: 40px;
            }
        }
        .loading{
            width: 90px;
            height: 90px;
            border-top: 10px rgb(0, 132, 255) solid;
            border-radius: 100px;
            animation: loading 1s infinite linear;
            -moz-animation: loading 1s infinite linear; /* Firefox */
            -webkit-animation: loading 1s infinite linear; /* Safari and Chrome */
            -o-animation: loading 1s infinite linear; /* Opera */
        }

        // .loading-1{
        //     width: 50px;
        //     height: 50px;
        //     top: 0;
        //     left: 0;
        //     right: 0;
        //     bottom: 0;
        //     margin: auto auto;
        //     position: absolute;
        //     border-radius: 5px;
        //     background-color: rgb(0, 179, 170);
        //     animation: loading-1 2s infinite linear;
        //     -moz-animation: loading-1 2s infinite linear; /* Firefox */
        //     -webkit-animation: loading-1 2s infinite linear; /* Safari and Chrome */
        //     -o-animation: loading-1 2s infinite linear; /* Opera */
        // }
        // .loading-2{
        //     width: 90px;
        //     height: 90px;
        //     border-width: 5px;
        //     border-top: 5px rgb(133, 133, 133) solid;
        //     border-right: 5px rgb(119, 119, 119) solid;
        //     border-radius: 100px;
        //     animation: loading 1s infinite linear;
        //     -moz-animation: loading 1s infinite linear; /* Firefox */
        //     -webkit-animation: loading 1s infinite linear; /* Safari and Chrome */
        //     -o-animation: loading 1s infinite linear; /* Opera */
        // }
    }

    @keyframes loading {
        from{
            transform: rotate(0deg);
        }
        to{
            transform: rotate(360deg);
        }
    }

    // @keyframes loading-1 {
    //     0%{
    //         bottom: 0px;
    //         transform: rotate(0deg) scaleY(1);
    //     }
    //     25%{
    //         bottom: 20px;
    //         transform: rotate(5deg) scaleY(1.1);
    //     }
    //     50%{
    //         bottom: 0px;
    //         transform: rotate(0deg) scaleY(1);
    //     }
    //     75%{
    //         bottom: 20px;
    //         transform: rotate(-5deg) scaleY(1.1);
    //     }
    //     100%{
    //         bottom: 0px;
    //         transform: rotate(0deg) scaleY(1);
    //     }
    // }
}

